<template>
	<view>
		<view class="sticky bg-fff z-index1">
			<u-tabs :list="tabs" :activeColor="$zs" :isScroll="false" :current="current"
				@change="current=$event,getList()" />
		</view>
		<view class="p20">
			<u-empty v-if="!list.length" marginTop="100" />
			<view class=" ">
				<view v-for="(item,index) in list" :key="index" class="p20 radius20 bg-fff mb20">
					<view class="mb20 pb20 border-b">
						<view class="radius10 bg-f5f flex fs26">
							<view class="mr20">
								<image :src="item.image||''" class="w80 h80 radius10" mode="aspectFill"></image>
							</view>
							<view class="flex1 line-1">{{item.service_name}}</view>
							<view class="pr20 color-999" v-if="item.finish_time">完成时间:{{item.finish_time}}</view>
						</view>
					</view>
					<comment :item="item" reply />
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				current: 0,
				tabs: [{
						name: '好评',
						type: 'good'
					},
					{
						name: '中评',
						type: 'medium'
					},
					{
						name: '差评',
						type: 'bad'
					},
				],
				list: '',
				item_data: ''
			};
		},
		onShow() {
			this.getList()
		},
		onReachBottom() {
			this.getList('down')
		},
		methods: {
			getList(e) {
				e == 'down' ? this.page++ : this.page = 1
				let params = {
					...this.$params,
					page: this.page,
					type: this.tabs[this.current].type,
				}
				this.$request('/member/my/commentList', params).then(res => {
					let list = res.data.data
					e == 'down' ? this.list.push(...list) : this.list = list
				})
			},
			// 回复评价：/master/my/replyComment

			// comment_id：评价id
			// reply：回复内容
			
		}
	}
</script>

<style lang="scss">
	.sticky {
		position: sticky;
		top:0;
		/* #ifdef H5 */
		top: 44px;
		/* #endif */
	}
</style>